<template>
	<view class="container">
		<view class="box" @click="upload">
			<view class="content">
				<view class="cover">
					<image src="/static/images/signIn/upload.png" mode=""></image>
				</view>
				上传名单
			</view>
		</view>
		<view class="box mgt-20" @click="download">
			<view class="content">
				<view class="cover ">
					<image src="/static/images/signIn/download.png" mode=""></image>
				</view>
				导出签到名单
			</view>

		</view>
		<view class="button" @click="gohelp">
			查看帮助
		</view>
		<!-- 提示信息弹窗 -->
		<uni-popup ref="message" type="message">
			<uni-popup-message type="error" message="签到填写信息项中没有姓名选项" :duration="2000"></uni-popup-message>
		</uni-popup>
		<!-- 提示窗示例 -->
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="success" cancelText="关闭" confirmText="删除" title="通知" content="确定要删除此管理员吗？"
				@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
		</uni-popup>

		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="success" cancelText="复制地址" confirmText="保存文件" title="请选择导出类型"
				content="温馨提示如果小程序中查看文件提示异常，请复制文件地址到浏览器中查看与下载" @confirm="dialogConfirm" @close="dialogClose">
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import Vue from 'vue'
	import {
		signAddCheck,
		signExportCheck
	} from '@/api/activity.js';
	import {
		upload
	} from "@/api/index.js"
	export default {

		data() {
			return {
				code: "",
				isHaveName: false,
				exportlink: "",
				isupload: false
			}
		},
		onLoad(options) {
			this.code = options.code
			this.isHaveName = options.isHaveName
		},
		onShow() {
			this.init()
		},
		methods: {
			// 保存文件
			dialogConfirm() {
				Vue.prototype.$uniApi.saveFile(this.exportlink);
			},
			init() {


			},
			// 复制地址
			dialogClose() {
				uni.setClipboardData({
					data: this.exportlink,
					success: function() {
						console.log('success');
					}
				});
			},
			gohelp() {
				uni.navigateTo({
					url: "../me/help"
				})
			},
			upload() {
				this.isupload = true
				uni.chooseMessageFile({
					count: 1,
					type: 'file',
					success: (res) => {
						uni.showLoading({
							title: '上传中...',
						})
						const path = res.tempFiles[0].path
						let size = res.tempFiles[0].size;
						let filename = res.tempFiles[0].name;
						if (filename.indexOf(".xls") == -1) {
							uni.showModal({
								title: '提示',
								content: '文件类型必须为excel！(.xls)',
								confirmColor: '#0177ff',
								confirmText: '确定',
							})

						} else {
							//res.tempFiles[0].path
							//这里写选择exec文件后的操作    
							console.log(res.tempFiles[0].path);
							upload({
								filePath: res.tempFiles[0].path,
							}).then(ras => {
								uni.hideLoading();
								signAddCheck({
									data: {
										code: this.code,
										file_path: ras.info.path
									}
								}).then(res => {
									if (res.code == 1) {
										console.log(res.data)
										uni.showToast({
											title: "上传成功！"
										})
									} else {
										uni.showToast({
											title: "上传失败！",
											icon: "error"
										})
									}
								})
							})
						}

					}
				})
			},
			download() {
				// console.log(this.isupload, 'this.isuploadsdfsdfsdfsdfsdfsdf');
				// if (this.isupload == false) {
				// 	uni.showToast({
				// 		title: "请先上传名单",
				// 		icon:"none",
				// 	})
				// 	return
				// } else {
					
				// }
				if (this.isHaveName == 'true') {
					uni.showLoading({
						title:'加载中···'
					})
					signExportCheck({
						data: {
							code: this.code
						}
					}).then(res => {
						console.log(res.data)
						console.log(this.isHaveName);
						console.log('下载成功')
						uni.hideLoading()
						this.exportlink = res.data
						this.$refs.alertDialog.open()
						
				
					})
				} else {
					this.$refs.message.open()
				}

			}
		}
	}
</script>
<style lang="scss" scoped>
	.container {
		padding: 20upx;
		background-color: #f6f6f6;
		min-height: 100vh;

		.box {
			width: 100%;
			height: 300upx;
			background-color: #FFFFFF;
			border-radius: 10upx;
			box-shadow: 0 0 8upx #eee;
			display: flex;
			align-items: center;
			justify-content: center;

			.content {
				display: flex;
				flex-direction: column;
				text-align: center;
				justify-content: center;

				.cover {
					width: 100upx;
					height: 100upx;
					margin: 0 auto;
					margin-bottom: 5upx;

					image {
						width: 100%;
						height: 100%;
					}

				}
			}
		}

		.button {
			color: #fff;
			font-size: 34upx;
			height: 85upx;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #1e90ff;
			width: 700upx;
			margin: 0 auto;
			margin-top: 30upx;
			border-radius: 10upx;
		}
	}
</style>
